<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客详情</title>
    <!-- css引入   -->
    <th:block th:include="hander/navigation :: common(~{::links})"></th:block>
    <!--  js引入  -->
    <th:block th:include="/hander/navigation :: commonjs"></th:block>
    <script>
        $(function () {
            // 加载当前博客评论
            selectByEid($("#eid").val(),1,5)
        });
    </script>
</head>
<body class="after-body">
<!--  顶部导航栏  -->
<th:block th:replace="/hander/navigation :: navheader" ></th:block>
<div class="row body2">
<!--  个人信息左边  -->
    <div class="col-md-4 ">
<!--  博主日常信息如获赞量、访问量...  -->
        <div class="leftuserinfo" >
            <!--  用户头像及站龄  -->
            <div class="after-index">
                <div style="width:70px;height: 70px;float: left">
                    <!-- 头像 -->
                    <a th:href="@{/#}"  title="张三">
                        <img th:src="@{/images/index/1.png}" class="img-circle imagesuser" >
                    </a>
                </div>
                <div class="nickname">
                    <a th:href="@{/#}"  title="张三">
                        <span>张三</span>
                    </a>
                </div>
                <div class="renzinfo">
                    <span class="everyday-info">站龄6年</span>&emsp;
                    <span style="font-family: '微软雅黑', '黑体', serif, '宋体'">
                    <img th:src="@{/images/index/renz.png}" width="15px" height="16px">&nbsp;
                    暂无认证
                </span>
                </div>
            </div>
            <!--  原创 获赞 访问 收藏...      -->
            <div class="after-index infocount" >
                <table align="center" class="blogtable">
                    <tr>
                        <td><a>51</a></td>
                        <td>51</td>
                        <td>51</td>
                        <td>51</td>
                        <td>51</td>
                    </tr>
                    <tr class="everyday-info">
                        <td><a style="color: #7f8087">原创</a></td>
                        <td>收藏</td>
                        <td>获赞</td>
                        <td>评论</td>
                        <td>访问</td>
                    </tr>
                </table>
            </div>
            <span class="hx3"></span>
            <!--  粉丝 积分 周排名 总排名 等级...  -->
            <div class="after-index" style="padding: 10px 0 0 11px;" >
                <table align="center" class="blogtable">
                    <tr>
                        <td style="padding-left: 4px">51</td>
                        <td style="padding-left: 16px">51</td>
                        <td style="padding-left: 7px">51</td>
                        <td style="padding-right: 5px">51</td>
                        <td style="padding-right: 20px">
                            <img th:src="@{/images/index/class.png}" width="20px" height="22px" />
                        </td>
                    </tr>
                    <tr class="everyday-info">
                        <td style="padding-left: 6px">粉丝</td>
                        <td style="padding-left: 19px">积分</td>
                        <td style="padding-left: 6px">周排名</td>
                        <td style="padding-right: 7px">总排名</td>
                        <td style="padding-right: 15px">等级</td>
                    </tr>
                </table>
            </div>
            <!--  他的主页 私信 关注.. -->
            <div class="after-index" style="margin: 13px 0 0 0;">
                <div style="padding-left: 20px">
                    <button type="button" class="btn btn-default " >Ta的主页</button>&emsp;
                    <button type="button" class="btn btn-default btn-sm" style="width: 80px;" >私信</button>&emsp;
                    <button type="button" class="btn btn-danger" style="width: 80px;outline: none;" >关注</button>&emsp;
                </div>
            </div>
        </div>
<!--  Search搜索框  -->
        <div class="search-essay">
            <div class="search">
                <input type="text" placeholder="搜索博主文章">
                <a th:href="@{/#}"><img th:src="@{/images/index/search.png}" width="30px"  height="40px"></a>
            </div>
        </div>

    </div>
    <div class="col-md-8 media-middle ">
<!--  博客详情右边  -->
        <div class="bloginfo">
            <!--      博客      -->
            <th:block th:each="essay,essayStat:${pageResult.getObjects()}">
                <input type="hidden" id="eid" th:value="${essay.eid}">
            <div class="person-news-item">
                <!-- 文章标题 -->
                <h2><b th:text="${essay.etitle}">MyBatis-Plus之代码生成器</b></h2>
                <!-- 当前文章发布时间 类别 标签  -->
                <div class="newdate-classify">
                    <div style="width: 40px;float: left;">
                        <img th:src="@{/images/index/yuanchuang.png}" height="30px" alt="原创" >
<!--                        <img th:src="@{/images/index/zhuangzai.png}" height="30px" alt="转载" >-->
                    </div>
                    <div class="newdate-classify2">
                        <button data-toggle="tooltip" data-placement="bottom" th:title="|最后发布:${#dates.format(essay.gmtModified,'yyyy-MM-dd HH:mm:ss')}&emsp;首发:${#dates.format(essay.gmtCreate,'yyyy-MM-dd HH:mm:ss')}|" th:text="${#dates.format(essay.gmtModified,'yyyy-MM-dd HH:mm:ss')}" >
                            2020-5-1 14:12:56
                        </button>
                        <span>
                            <img th:src="@{/images/index/fw.png}"
                                 width="25px" height="20px" style="margin: 0 0 2px 20px" alt="访问量" title="访问量" />
                            <span th:text="${essay.EReadStatis}" >454</span>

                            <img th:src="@{/images/index/comment.png}"
                                 width="25px" height="20px" style="margin: 0 0 2px 20px" alt="评论量" title="评论量" />
                            <span th:text="${essay.EComment}">123</span>

                            <img th:src="@{/images/index/dz0.png}"
                                 width="25px" height="20px" style="margin: 0 0 2px 20px" alt="点赞量" title="点赞量" />
                            <span th:text="${essay.EPraiseStati}">123</span>

                            <a th:href="@{/#}" style="color: #7f8087;">
                                <img th:src="@{/images/index/shoucang.png}"
                                     width="25px" height="20px" style="margin: 0 0 2px 20px" alt="收藏" title="收藏" />
                                <span th:text="${essay.ECollect}">123</span>
                            </a>

                        </span>

                    </div>
                    <!-- 个人分类专栏 标签 -->
                    <div class="newdate-classify2" style="height: 40px">
                        <span style="">分类专栏：</span>
                        <button style="background: white;width: 60px;height: 25px;" th:text="${essay.special.sname}" >java</button>
                        &emsp;&emsp;
                        <span>标签：</span>
                        <th:block th:each="lable,labelStat:${essay.lables}">
                            <button style="background: white;width: auto;padding-right: 5px;padding-left: 5px;height: 25px;" th:text="${lable.bname}">js</button>
                        </th:block>
                    </div>
                </div>
                <!-- 文章内容 -->
                <input type="hidden" id="nr" th:value="${essay.eessay}">
<!--    将接受到的HTML+文字转化为标签输出。默认是字符串  -->
                <script>
                    $(function () {
                        var eblog = $("#nr").val();
                        $("#essay").html(eblog);
                    });
                </script>
                <div style="padding-top: 30px;padding-bottom: 40px" id="essay" ></div>
            </div>
            </th:block>
            <!--  点赞 评论  -->
            <div class="zan-pl">
                <div class="zan-pl2">
                    <div class="btn-group btn-group-sm " style="margin: 6px 0 0 0;">
                        <!--  点赞 -->
                        <label class="btn-group">
                            <button type="button" class="btn btn-default">
                                <img th:src="@{/images/index/dz0.png}" width="25px" alt="点赞">
                                <span style="color: #7f8087"> 点赞</span>
                            </button>
                        </label>
                        <!--  已赞 -->
<!--                        <label class="btn-group">-->
<!--                            <button type="button" class="btn btn-default">-->
<!--                                <img th:src="@{/images/index/dz1.png}" width="25px" alt="点赞">-->
<!--                                <span style=""> 已赞</span>-->
<!--                            </button>-->
<!--                        </label>-->
                        <!--  评论 -->
                        <label class="btn-group">
                            <!-- 引用瞄点 -->
                            <a href="#pl">
                                <button type="button" class="btn btn-default">
                                    <img th:src="@{/images/index/comment.png}" width="25px" alt="点赞">
                                    <span style="color: #7f8087"> 评论</span>
                                </button>
                            </a>
                        </label>
                    </div>
                </div>
            </div>
        </div>
        <!-- 评论区 -->
        <div class="bloginfo" style="margin: 20px 0 0 0;">
            <div class="person-news-item">
                <div class="plq">
                    <!-- 设置瞄点 -->
                    <a name="pl" style="cursor: unset;color: #7f8087">
                        <a th:href="@{/#}">
                        <img th:src="@{/images/index/1.png}" alt="头像" class="img-circle" width="30px" height="30px" style="float: left;margin: 4px 0 15px 0;">
                        </a>
                        <!-- 文本域  -->
                        <input type="hidden" id="aid" th:value="${session.aid}">
                        <div id="textbtn" >
                            <textarea  class="texttarea-pl" name="cname" id="cname" maxlength="1000"  placeholder="说说此刻的想法" onclick="inspect()"></textarea>
                            <div id="puslish" hidden style="margin: 10px 0 0 350px;">
                                <span>限1000字符 &emsp;</span>
                                <button type="button" class="btn btn-danger" style="outline: none;" onclick="publish()">发表评论</button>
                            </div>
                        </div>
                    </a>
                </div>
                <!--  plq  -->
                <div id="plq">

                    <div class="plq">
                        <div style="float: left;">
                            <a th:href="@{/#}">
                                <img th:src="@{/images/index/1.png}" alt="头像" class="img-circle" width="30px" height="30px" style="float: left;margin: 4px 0 15px 0;">
                            </a>
                        </div>

                        <div class="plguode">
                            <span>&emsp;&emsp;&emsp;飞翔的小牛:&nbsp;</span>
                            <span>棒棒的，话说上面这些面试题，2年工作经验都这么难么，平时工作996业务开发根本涉及不到其中的1%</span>
                            <div>
                                <span style="float: right;">
                                    <span>2020-02-12 15:12:20</span>
                                    &emsp;
                                    <img th:src="@{/images/index/dz0.png}" width="25px">
                                </span>
                            </div>
                        </div>
                        <span class="hx4"></span>
                    </div>
                    <div class="plq">
                        <div style="float: left;">
                            <a th:href="@{/#}">
                                <img th:src="@{/images/index/1.png}" alt="头像" class="img-circle" width="30px" height="30px" style="float: left;margin: 4px 0 15px 0;">
                            </a>
                        </div>

                        <div class="plguode">
                            <span>&emsp;&emsp;&emsp;飞翔的小牛:&nbsp;</span>
                            <span>棒棒的，话说上面这些面试题，2年工作经验都这么难么，平时工作996业务开发根本涉及不到其中的1%</span>
                            <div>
                                <span style="float: right;">
                                    <span>2020-02-12 15:12:20</span>
                                    &emsp;
                                    <img th:src="@{/images/index/dz0.png}" width="25px">
                                </span>
                            </div>
                        </div>
                        <span class="hx4"></span>
                    </div>
                </div>
                <!--  分页  -->
                <div class="plq" id="plfy" style="text-align: center;"></div>
            </div>
        </div>
    </div>
</div>

</body>
</html>